<template>
	<view class="content">
		<view class="content_title">
			{{info.title}}
		</view>
		<view class="content_text">
			{{info.zuozhe?'作者：'+info.zuozhe:info.source}} {{info.date}}  点击 {{info.viewcount}} 次
		</view>
		<view class="content_daodu" v-if="info.zhaiyao">
			<text>导读</text>{{info.zhaiyao}}
		</view>
		<video :autoplay="true" :loop="true" :src="info.videofilepath" object-fit="cover" class="content_video">
		</video>
		<view class="content_html" v-html="formatRichText(info.content)">
			
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		defineProps,
	} from 'vue'
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app'
	import {
		homeApi
	} from "@/api/index"
	import {link,formatRichText} from '@/utils/utils.js'
	const id = ref('')
	onLoad((open)=>{
		id.value = open.id
		getData()
	})
	const info = ref({})
	const getData = async()=>{
		let data = {
			do:'txlvideodetail',
			newsid:id.value
		}
		let res = await homeApi.publicGet(data)
		for (let i = 0; i < res.columns.length; i++) {
			if (res.columns[i].name == 'txlvideodetail') {
				info.value = res.columns[i]
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		width: calc(100% - 60rpx);
		padding: 30rpx;
		&_title{
			font-size: 36rpx;
			color: #01307b;
		}
		&_text{
			font-size: 26rpx;
			margin-top: 40rpx;
			color: #666;
		}
		&_daodu{
			margin-top: 30rpx;
			padding: 20rpx;
			width: calc(100% - 40rpx);
			background: #e3e3e3;
			color: #2c364a;
			font-size: 28rpx;
			line-height: 50rpx;
			text{
				background: #2a61c1;
				padding: 4rpx;
				color: #fff;
				margin-right: 8rpx;
			}
		}
		&_video{
			width: 100%;
			height: 400rpx;
			margin-top: 20rpx;
		}
		&_html{
			margin-top: 40rpx;
			width: 100%;
			overflow-x: auto;
		}
	}
</style>